<div class="row" ng-controller="essayCtrl">
	<div class="col-lg-12">
		<div class="col-lg-1"></div>
		<div class="col-lg-10">
		<div id="myCarousel" class="carousel slide" data-ride="carousel" data-interval="2000" data-pause="hover" data-wrap="true">
		    <!-- 轮播（Carousel）指标 -->
		    <ol class="carousel-indicators">
		        <li  ng-repeat="x in slider" data-target="#myCarousel" data-slide-to="{{$index}}" ng-class="($index==0)?'active':''"></li>
		        
		    </ol>
		    <!-- 轮播（Carousel）项目 -->
		    <div class="carousel-inner"  >
		        <div ng-class="($index==0)?'item active':'item'" ng-repeat="x in slider">
		            <img ng-src="{{x.src}}" alt="First slide" style="width:100%;height:550px;" >
		            <div class="carousel-caption">
		            	<h3 style="font-size:26px;">{{x.title}}</h3>
		            	<p style="font-size:17px;line-height:25px;">{{x.outLine}}...</p>
		            </div>
		        </div>
		    </div>
		    <!-- 轮播（Carousel）导航 -->
		    <a class="left carousel-control prev-slide"  role="button" data-slide="prev">
		        <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
		    </a>
		    <a class="right carousel-control next-slide"  role="button" data-slide="next">
		        <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
		    </a>
		</div>
	</div>
	</div>

	<div class="col-lg-12">
		<div class="widget">
			<div class="widget-header bordered-bottom bordered-themeprimary" style="margin-top: 20px;height: 40px;font-size: 16px" >
				<i class="widget-icon fa fa-tasks "></i>
				<span class="widget-caption" style="font-size: 16px;">文章列表</span>

				<!-- <div class="pull-right">
					<ul>
						<li>
						<span class="input-icon " >
							<i class="fa fa-search gray"></i>
							<input type="text"  class="form-control" placeholder="寻找文章" style="margin-top: 2px;width: 250px;"/>
						</span>
						</li>
					</ul>
				</div> -->
			</div>
			<div class="containrightcontain">
				<ul class="containrightcontainul">
					<li ng-repeat="x in essays">
							<div class="lileft">
							<img ng-src="{{x.cover}}" />
							</div>
							<div class="liright">
							<button class="btn btn-danger essay-button" id="bootbox-confirm" ng-click="delEssay(x.id)">删除</button>
							<button class="btn btn-warning essay-button" id="bootbox-confirm"><a ui-sref="essayWrite({id:'{{x.id}}'})" style="color:white">修改</a></button>
							<a ui-sref="showEssay({id:x.id})"><h1 class="actcletitle">【活动】{{x.title}}</h1></a>
							<div class="actclebrief" style="margin: 12px 15px 12px 10px;">{{x.outLine}}...</div>

						    <!-- <span class="write">produced by:</span> -->
						    <span class="date" style="display:inline-block;margin-left:10px;">{{x.date}}</span>
							</div>
					</li>
				</ul>
				<hr style="height:1px;border:none;border-top:1px dashed #328D3F;width: 98%;" />
				<div class="row DTTTFooter">
				<div class="col-sm-7">
					<span style="margin-left: 20px;font-size: 16px;">共有{{recordsnum}}篇文章</span>
					<button class="btn btn-success" style="margin-left:70%;"  ui-sref="essayWrite">编写文章</button>
				</div>
				<div class="col-sm-5" >
					<div class="pull-right" style="margin-right: 40px;margin-bottom: 20px;">
						<!-- <ul class="pagination">
							<li><a href="#"><<</a></li>
							<li><a href="#">1</a></li>
							<li><a href="#">2</a></li>
							<li><a href="#">>></a></li>
						</ul> -->
						<pagination current-page="currentPage" total-page="totalPage" get-record="getRecord()">
						</pagination>
					</div>
				</div>
			</div>
			</div>
		</div>
	</div>
	<!-- 删除确认弹框 -->
  <div class="modal-preview"  ng-if="showModal">
    <div class="modal modal-primary">
      <div class="modal-dialog">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" ng-click="delEssay()" data-dismiss="modal" aria-hidden="true">×</button>
            <h4 class="modal-title">删除该文章</h4>
          </div>
          <div class="modal-body">
            <p>确认删除此文章吗？请谨慎操作！</p>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-warning" data-dismiss="modal" ng-click="delEssay()">取消</button>
            <button type="button" class="btn btn-primary" ng-click="sureDelEssay()">确认</button>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>


<script>
	$(function(){
        $(".prev-slide").click(function(){
            $("#myCarousel").carousel('prev');
        });
        // 循环轮播到下一个项目
        $(".next-slide").click(function(){
            $("#myCarousel").carousel('next');
        });
   	});

   	$(function() {
	  $( ".modal-preview" ).draggable();
	});

</script>
